#main {
  background-position: center top;
  background-size: 100% auto;
  background-repeat: repeat;
  background-image: url(https://openeuler-website-beijing.obs.cn-north-4.myhuaweicloud.com/detail-banner/discourse-bg.png);
}
.discourse-root {
  padding-bottom: 64px;
}
#main-outlet-wrapper {
  margin-top: 64px;
  padding: 40px;
  background-color: var(--o-color-bg2);
  width: calc(100% - 48px);
  box-shadow: var(--o-shadow-l1);
  @media (max-width: 768px) {
    width: calc(100% - 32px);
    margin: 24px auto;
    padding: 12px;
  }
  #main-outlet {

    padding-top: 0;
    .category-drop {
        display:none;
    }

    #list-area {
      margin: 0;
      .topic-list-header {
        background-color: var(--o-color-white);
      }
      .topic-list-body {
          border-top:none;
        tr {
            &:hover {
                .main-link {
                    .raw-link {
                        color:var(--o-color-black);
                    }
                }
            }
          .main-link {
            display: flex;
            flex-direction: column-reverse;
            .category-name {
              color: var(--o-color-black);
              font-size: var(--o-font-size-text);
              line-height: var(--o-line-height-text);
            }
            .link-top-line {
                color:var(--o-color-text4);
                font-size:var(--o-font-size-h7);
                line-height:var(--o-line-height-h7);
            }
          }
          .topic-list-data {
              padding:16px 5px;
              padding-left:10px;
          }
        }
      }
    }

    .details {
    background-color:var(--o-color-white);
    .primary {
            .controls {
          .btn-default {
            display:none;
          }
        }
    }
    }

    .user-content-wrapper {
      .user-content {
        padding: 24px;
        
      }
    }
  }
}

.d-header {
  height: 80px;
  box-shadow: var(--o-shadow-l1);
  @media (max-width: 768px) {
    height: 48px;
  }
  > .wrap {
    padding: 0;
    width: calc(100% - 48px);
    .d-header-icons {
      display: flex;
      align-items: center;
      .search-dropdown,
      .hamburger-dropdown {
        .d-icon {
          color: var(--o-color-text1);
          font-size: 20px;
          font-weight: 100;
        }
      }
    }
    .user-menu {
      a {
        svg {
          display: none;
        }
      }
    }

    @media (max-width: 768px) {
      width: calc(100% - 32px);
      padding: 12px;
    }
    #site-logo {
      height: inherit;
    }
  }
}

.wrap {
  max-width: 1416px;
  padding: 0 40px;
}

.select-kit.single-select .select-kit-filter {
  flex-direction: row-reverse;
  .filter-icon {
    margin-left: 0;
    margin-right: 8px;
  }
}

#create-topic {
    flex-direction:row-reverse;

 background:var(--o-color-brand1);
 color:var(--o-color-white);
 .d-icon {
     font-weight:100;
         margin:0 0 0 8px;
     color:var(--o-color-white);
 }
}
